<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="chrome://zotero/skin/zotero.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero/skin/about.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero-platform/content/zotero.css" type="text/css"?>
<!DOCTYPE window SYSTEM "chrome://zotero/locale/about.dtd">

<window
	xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
	onload="moveToAlertPosition(); sizeToContent(); document.getElementById('zotero-about').getButton('accept').focus();"
	inwindowmenu="false">
	<script>
		var { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm");
		Services.scriptloader.loadSubScript("chrome://zotero/content/include.js", this);
		Services.scriptloader.loadSubScript("chrome://zotero/content/customElements.js", this);
	</script>
<dialog
		id="zotero-about"
		class="zotero-window"
		buttons="accept"
		buttonlabelaccept="&zotero.about.close;"
		ondialogaccept="return true;">
	
	<vbox id="aboutcontent" class="zotero-dialog">
		<div xmlns="http://www.w3.org/1999/xhtml">
			<img id="logo" src="chrome://zotero/skin/zotero.svg" alt="Zotero" />
		</div>
		<hbox>
			<label id="version"/>
			<label id="changelog" is="zotero-text-link" value="&zotero.whatsNew;"/>
		</hbox>
		<script>
			var version = Zotero.version;
			if (!Zotero.isMac) {
				version += ` (${Services.appinfo.is64Bit ? '64' : '32'}-bit)`;
			}
			document.getElementById('version').textContent = version
		</script>
		<vbox>
			<div id="about-text" xmlns="http://www.w3.org/1999/xhtml">
				<p id="created-by"></p>
				<p id="third-party-software"></p>
				<p id="get-involved"></p>
				<script><![CDATA[
					Components.utils.import("resource://zotero/config.js");
					
					document.getElementById('changelog').href = ZOTERO_CONFIG.CHANGELOG_URL;
					
					// Replace [links] in localized strings with spans with onclick handlers
					//
					// TODO: Use helper function in common with intro text in itemTreeView.js
					document.getElementById('created-by').innerHTML =
						Zotero.Utilities.htmlSpecialChars(
							Zotero.getString(
								'about.createdBy',
								[Zotero.appName, `[${ZOTERO_CONFIG.PRODUCER}]`]
							),
						)
						.replace(
							/\[([^\]]+)](.+)\[([^\]]+)]/,
							`<span data-href="${ZOTERO_CONFIG.PRODUCER_URL}">$1</span>`
								+ '$2'
								+ `<span data-href="${ZOTERO_CONFIG.CREDITS_URL}">$3</span>`
						);
					
					document.getElementById('third-party-software').innerHTML =
						Zotero.Utilities.htmlSpecialChars(
							Zotero.getString('about.openSource', Zotero.appName)
						)
						.replace(
							/\[([^\]]+)](.+)\[([^\]]+)]/,
							`<span data-href="${ZOTERO_CONFIG.LICENSING_URL}">$1</span>`
								+ '$2'
								+ `<span data-href="${ZOTERO_CONFIG.CREDITS_URL}#third-party_software">$3</span>`
						);
					
					document.getElementById('get-involved').innerHTML =
						Zotero.Utilities.htmlSpecialChars(Zotero.getString('about.getInvolved'))
						.replace(
							/\[([^\]]+)]/,
							`<span data-href="${ZOTERO_CONFIG.GET_INVOLVED_URL}">$1</span>`
						);
					
					// Activate text links
					for (let span of document.getElementById('about-text').getElementsByTagName('span')) {
						span.className = 'text-link';
						span.setAttribute('role', 'link');
						span.onclick = function () {
							Zotero.launchURL(this.getAttribute('data-href'));
						};
					}
				]]></script>
			</div>
		</vbox>
	</vbox>
</dialog>
</window>
